﻿@using BoYuanCore.Framework.StringUtility
@using BoYuanCore.Web
@using BoYuanCore.Web.Areas.Admin.Controllers

@{
    ViewBag.Title = "页面组件列表";
    var F = Html.F();
}

@section head {
    <style>
        .mytable {border-width: 1px;border-style: solid;border-collapse: separate;border-spacing: 0;border-bottom-width: 0;border-right-width: 0;}
        .mytable th, .mytable td {padding: 5px;text-align: left;border-bottom-width: 1px;border-bottom-style: solid;border-right-width: 1px;border-right-style: solid;}
    </style>
}

@section body {
    @(
    F.RegionPanel().ID("RegionPanel1").ShowBorder(false).IsViewPort(true).Regions(
           F.Region().ID("Region2").RegionSplit(true).Width(200).ShowHeader(false).EnableCollapse(true).Layout(LayoutType.Fit).RegionPosition(Position.Left).Items(
               F.Tree().ID("Tree1").Width(650).ShowHeader(true).Title("页面菜单(右键功能操作)").Nodes((TreeNode[]) ViewBag.Tree1DataSource)
                   .Listener("nodeclick", "onTree1NodeClick").Listener("beforenodecontextmenu", "onTreeNodeContextMenu")

               )
           , F.Region().ID("mainRegion").ShowHeader(false).RegionPosition(Position.Center).Layout(LayoutType.Fit).Items(
               F.Grid().Layout(LayoutType.Fit).AllowPaging(true).IsDatabasePaging(true).EnableCheckBoxSelect(true).CheckBoxSelectOnly(true).ShowHeader(false).ShowBorder(true)
                   .ID("Grid1").Listener("paging", "onGridBind").DataIDField("GridID").EnableTextSelection(true).EnableHeaderMenu(false).ExpandAllRowExpanders(true)
                   //.Toolbars(F.Toolbar().Position(ToolbarPosition.Top)
                   //    .Items(
                   //        F.TextBox().ID("txb_keyword").EmptyText("关键词查询"),
                   //        F.Button().ID("BtnSearch").Text("查询").Icon(Icon.SystemSearch).OnClientClick("onGridBind()")
                   //    )
                   //)
                   .PageItems(
                       F.ToolbarSeparator(),
                       F.DropDownList().ID("ddlPageSize").Width(160).Label("每页记录数")
                           .Items(
                               F.ListItem().Text("10").Value("10"),
                               F.ListItem().Text("20").Value("20").Selected(true),
                               F.ListItem().Text("50").Value("50"),
                               F.ListItem().Text("100").Value("100")
                           ),
                       F.ToolbarSeparator(),
                       F.Button().ID("Button_delete").Icon(Icon.Delete).Text("批量删除").OnClientClick("DeleteRows();")
                   )
                .Columns(
                    //F.RowNumberField(),
                    F.RenderField().HeaderText("编辑").ColumnID("Actions").Width(50).RendererFunction("renderActions")
                    , F.RenderField().HeaderText("页面名称").DataField("PageTitle").Width(150)
                    , F.RenderField().HeaderText("地址").DataField("Url").Width(350)
                    , F.RenderField().HeaderText("图标").DataField("Icon").Width(50).RendererFunction("renderIcon")
                    , F.RenderField().HeaderText("字体图标").DataField("ShowFontIcon").Width(120).RendererFunction("renderFontIcon")
                    , F.RenderField().HeaderText("父id").DataField("ParentID").FieldType(FieldType.Int).TextAlign(TextAlign.Right).Width(100)
                    , F.RenderField().HeaderText("tree路径").DataField("TreePath").MinWidth(150).ExpandUnusedSpace(true)
                    , F.RenderCheckField().HeaderText("是否为叶").DataField("IsLeaf").RenderAsStaticField(true).Width(78)
                    , F.RenderCheckField().HeaderText("状态隐藏").DataField("IsHidden").RenderAsStaticField(true).Width(78)
                    , F.RenderField().HeaderText("备注信息").DataField("Remark").Width(100)
                    , F.RenderField().HeaderText("排序").DataField("Sort").FieldType(FieldType.Int).TextAlign(TextAlign.Right).Width(80)
                    , F.RenderField().ColumnID("buttonInfo").RenderAsRowExpander(BaseController.HaveButtonPermissions).Hidden(!BaseController.HaveButtonPermissions).DataField("ShowButtonInfo")
                )
            )
        )
    )
    @(F.Window().ID("Window1").Height(500).Width(700).IsModal(true).EnableMaximize(true).EnableIFrame(true).Hidden(true).Icon(Icon.ApplicationFormEdit).Target(Target.Top).EnableResize(true)
        .CloseAction(CloseAction.HidePostBack).Listener("close", "GridAndTree"))
    @(
    F.Menu().ID("containerMenu").Hidden(true).Items(
        F.MenuButton().ID("btn_add").Icon(Icon.Add).Text("添加子节点").OnClientClick("addTree(0);")
    ,F.MenuSeparator()
    ,F.MenuButton().Icon(Icon.Reload).Text("刷新").OnClientClick("location.reload();"))
        )
    @(
    F.Menu().ID("itemMenu").Hidden(true).Items(
    F.MenuButton().ID("btn_add2").Icon(Icon.Add).Text("添加子节点").OnClientClick("addTree(getNodeID());")
    ,F.MenuButton().ID("btn_edit").Icon(Icon.Pencil).Text("修改").OnClientClick("editTree(getNodeID());")
    ,F.MenuSeparator()
    // ,F.MenuButton().ID("btn_Addbutton").Icon(Icon.Button).Text("增加Button").OnClientClick("AddButtton(getNodeID());")
    // ,F.MenuSeparator().ID("mstor")
    ,F.MenuButton().Icon(Icon.Reload).Text("刷新").OnClientClick("location.reload();"))
        )
}

@section script {
    <script>
        F.ready(function () {
            @if (ViewBag.InitLoadJs != null)
            {
               @Html.Raw(ViewBag.InitLoadJs)
            }

            onGridBind();
            F.ui.ddlPageSize.on('change', function() { onGridBind() });

            var grid = F.ui.Grid1;
            grid.el.on('click',
                'a.action',
                function(event) {
                    var cnode = $(this);
                    var rowEl = cnode.closest('.f-grid-row');
                    var rowData = grid.getRowData(rowEl);
                    var rowId = rowData.id;//GridID绑定后的值

                    if (cnode.hasClass('editit')) {

                        editTree(rowId); // 编辑窗体
                    }

                    if (cnode.hasClass('icon')) {
                        F.ui.Window1.show('@Url.Action("Icons")' + "?id=" + rowId, '设置图标');
                    }

                    if (cnode.hasClass('fonticon')) {
                        F.ui.Window1.show('@Url.Action("IconFonts")' + "?id=" + rowId, '设置字体图标');
                    }

                    if (cnode.hasClass('fonticon_fa')) {
                        F.ui.Window1.show('@Url.Action("IconFontsFa")' + "?id=" + rowId, '设置字体图标');
                    }
                }
            );
        })


        function GridAndTree() { //刷新tree和grid
            var selectedNode = F.ui.Tree1.getSelectedNode(true); //获取选中treeNode
            if (selectedNode) {
                F.doPostBack('@Url.Action("BindTree")', "RegionPanel1", { nodeid: selectedNode.id });
            }
            onGridBind();
        }

        function onGridBind(event, pageindex, oldPageIndex) {

            if (!pageindex) pageindex = 0;
            var grid1 = F.ui.Grid1;
            grid1.setPageIndex(pageindex);

            var result;
            var selectedNode = F.ui.Tree1.getSelectedNode(true); //获取选中treeNode
            //console.log(selectedNode)

            if (selectedNode) {
                result = {
                    nodeid: selectedNode.id,
                    nodetext: selectedNode.text,
                    dataType: selectedNode.attrs['dataType']
                };
            }

            // 触发后台事件
            F.doPostBack('@Url.Action("ShowGrid")', "RegionPanel1", result);
        }

        var buttonData;



        function DeleteRows() {
            var result = '', grid = F.ui.Grid1;
            var selectRows = grid.getSelectedRows(true);
            if (selectRows.length == 0) {
                NotifyQuestion("请选择要删除的选中行");
                return;
            }
            F.confirm({
                message: "确定要执行选中行删除操作吗？",
                ok: function() {
                    $.each(selectRows,
                        function(index, item) {
                            result +=
                                ',' +
                                item.id; // item.id对应绑定的.DataIDField("GridID")的值;item.values.字段1 对应列DataField("字段1")
                        });
                    F.doPostBack('@Url.Action("BtnDelete_Click")', { ids: result });
                }
            })
        }

        function renderIcon(value, params) {
            var info = '无';
            if (value && value.length > 0) info = GetHtmlImg(F.baseUrl + value);
            return renderBase('action icon', info);
        }

        function renderFontIcon(value, params) {
            var info = '';
            info += renderBase('action fonticon', "图标1") + " ";
            info += renderBase('action fonticon_fa', "图标2") + " ";
            info += value;
            return info;
        }

        function onTree1NodeClick(event, nodeId) {
            onGridBind();
        }

        function onTreeNodeContextMenu(event, nodeId) {

            if (nodeId == '-1') { //根节点是-1
                F.ui.containerMenu.show();
            } else {

                var selectedNode = F.ui.Tree1.getSelectedNode(true); //获取选中treeNode

                if (selectedNode) {
                    if (selectedNode.attrs['dataType'] == '2') { //页面
                        //F.ui.btn_Addbutton.show();
                        //F.ui.mstor.show();
                    } else { //文件夹
                        //F.ui.btn_Addbutton.hide();
                        //F.ui.mstor.hide();
                    }
                }

                F.ui.itemMenu.show();
            }
            return false; // 返回false，来阻止浏览器右键菜单
        }

        //获取中转值
        function getNodeID() {
            var selectedNode = F.ui.Tree1.getSelectedNode(true); //获取选中treeNode
            var nodeid = selectedNode.id;
            if (!nodeid || nodeid.length == 0) nodeid = -1;
            return nodeid;
        }

        var url = '@Url.Action("Add", "SysModule")';

        function addTree(pid) {
            F.ui.Window1.show(url + "?pid=" + pid, '添加页面组件');
        }

        function editTree(id) {
            F.ui.Window1.show(url + "?id=" + id, '编辑页面组件');
        }

        function AddButtton(pid) {
            F.ui.Window1.show('@Url.Action("AddButton")' + "?pid=" + pid, '添加页面按钮');
        }


        function EditBtn(id) {
            F.ui.Window1.show('@Url.Action("AddButton")' + "?id=" + id, '编辑页面按钮');
        }

        function DeleteBtn(id) {
             F.confirm({
                message: "确定要删除此Button数据？",
                ok: function() {
                    F.doPostBack({url:'@Url.Action("DeleteBtnData")', params: { id: id }
                        , complete: function (data) { onGridBind() }
                    });
                }
            })
        }

    </script>
}
